<template>
  <el-card class="empty">
    <card-list @select="selectItem" :list="videoList"></card-list>
    <div style="text-align:center;margin-top:30px">
      <el-pagination
        background
        layout="prev, pager, next"
        :current-page="page"
        :total="count"
        :page-size="page_size"
        :hide-on-single-page="shouPagination"
        @current-change="handleCurrent"
      ></el-pagination>
    </div>
  </el-card>
</template>

<script>
import { getMineVideo } from "@/api/videoService";
import cardList from "@/components/cardList";
export default {
  data() {
    return {
      videoList: [],
      uid: 0,
      page: 0,
      page_size: 6,
      count: 0,
      shouPagination: true, //隐藏分页
    };
  },
  methods: {
    _getVideoList() {
      getMineVideo(this.page, this.page_size).then((res) => {
        if (res.data.code === 200) {
          if (this.count == 0) {
            //只有查询第一页才返回总数
            this.count = res.data.data.count;
            if (this.count > this.page_size) {
              this.shouPagination = false;
            }
          }
          this.videoList = res.data.data.data;
        }
      });
    },
    selectItem(item) {
      //跳转视频页面
      this.$router.push({ name: "video", params: { vid: item.vid } });
    },
    handleCurrent(page) {
      this.page = page;
      this._getVideoList();
    },
  },
  created() {
    this.uid = this.$store.state.userInfo.Uid;
    this.page = 1;
    this._getVideoList();
  },
  components: {
    "card-list": cardList,
  },
};
</script>
<style >
.empty {
  min-height: 500px;
}
</style>